<template>
    <el-date-picker v-model="value"
                :type="pickerType"
                :style="domCss"
                :value-format="format"
                :format="format"
                :disabled='disabled'
                @change="Change('change')" 
                @blur='Change("blur")' 
                @focus='Change("focus")'
                :placeholder="`请选择${label}`"> </el-date-picker>
    
</template>

<script>
export default {
    props:{
        label: {
            type: String,
            default: ''
        },
        disabled: {
            type: Boolean,
            default: false
        },
        domCss: {
            type: String,
            default: ''
        },
        format: {
            type: String,
            default: 'yyyy-MM-dd'
        },
        pickerType: {
            type: String,
            default: 'date'
        },
        defaultValue: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            value:'',
        }
    },
    watch: {
        defaultValue: {
            deep: true,
            immediate: true,
            handler: function(v) {
                this.value = v
            }
        }
    },
    methods: {
        Change(type){
            this.$emit('EventHandler',type, this.$attrs.prop,this.value);
        },
    },
}
</script>

<style lang="scss" scoped>

</style>